[TOOL-4531] Dashboard: Add Token Asset creation wizard #7081
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. This stack of pull requests is managed by Graphite. Learn more about stacking. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7081 +/- ##
=======================================
Coverage 55.61% 55.61%
=======================================
Files 902 902
Lines 58177 58177
Branches 4085 4085
=======================================
Hits 32356 32356
Misses 25716 25716
Partials 105 105
🚀 New features to boost your workflow:
|
size-limit report 📦
|
MananTank
force-pushed
the
05-20-_tool-4531_dashboard_add_token_asset_creation_wizard
branch
from
7f8c64d to
c37589e
Compare
![graphite-app[bot]](https://avatars.githubusercontent.com/in/158384?s=60&v=4){kind=small}
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/form.ts
Outdated
Show resolved
Hide resolved
MananTank
force-pushed
the
05-20-_tool-4531_dashboard_add_token_asset_creation_wizard
branch
from
c37589e to
dbe4965
Compare
...ard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx
Outdated
Show resolved
Hide resolved
MananTank
force-pushed
the
05-20-_tool-4531_dashboard_add_token_asset_creation_wizard
branch
from
7e90eb0 to
24a556b
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (7)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx (3)
83-85: 🛠️ Refactor suggestionAdd form validation before proceeding to next step.
Currently, the code transitions to the next step without validating that the current form is valid. This could lead to incomplete or invalid data being used later in the flow.
onNext={() => { + // Validate form before proceeding + tokenInfoForm.trigger().then((isValid) => { + if (isValid) { setStep("distribution"); + } + }); }}
97-99: 🛠️ Refactor suggestionAdd form validation before proceeding to launch step.
Similar to the previous step transition, there's no validation before moving to the launch step.
onNext={() => { + // Validate form before proceeding + tokenDistributionForm.trigger().then((isValid) => { + if (isValid) { setStep("launch"); + } + }); }}
111-114: 🛠️ Refactor suggestionValidate combined form data before passing to LaunchTokenStatus.
When combining form data for the launch step, no validation is performed to ensure the complete dataset is valid.
{step === "launch" && ( <LaunchTokenStatus client={props.client} onLaunchSuccess={props.onLaunchSuccess} onPrevious={() => { setStep("distribution"); }} createTokenFunctions={props.createTokenFunctions} + // Ensure both forms are valid before proceeding + isValid={tokenInfoForm.formState.isValid && tokenDistributionForm.formState.isValid} + form={{ + tokenInfoForm, + tokenDistributionForm, + }} values={{ ...tokenInfoForm.getValues(), ...tokenDistributionForm.getValues(), }} /> )}apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/token-info-fieldset.tsx (4)
31-32: Improve form submission handling.The form submission directly calls the
onNextfunction without additional error handling or user feedback. Consider adding a loading state and error handling during form submission.<Form {...form}> - <form onSubmit={form.handleSubmit(props.onNext)}> + <form onSubmit={form.handleSubmit( + (data) => { + try { + props.onNext(); + } catch (error) { + console.error('Error in form submission:', error); + // Display error to user + } + }, + (errors) => { + console.log('Validation errors:', errors); + // Optionally scroll to first error + } + )}>
100-110: Handle chain data load errors and add selection validation.Currently, there's no explicit handling for potential network errors or failed chain data loading in the SingleNetworkSelector component.
The SingleNetworkSelector component should handle error states from chain data fetching, and the form should validate chain selection. Consider:
- Updating useAllChainsData to return isLoading, isError, and error flags
- Modifying SingleNetworkSelector to accept these flags and render appropriate loading/error states
- Adding form validation to require chain selection
#!/bin/bash # Check current implementation of SingleNetworkSelector error handling rg -n "export function SingleNetworkSelector" -A10 -B10 apps/dashboard/src/@/components/blocks/NetworkSelectors.tsx
48-57: 🛠️ Refactor suggestionAdd error handling for file uploads.
The FileInput component handles file selection but doesn't appear to have error handling for common upload issues like file size limits or format validation failures beyond the
acceptprop.<FileInput accept={{ "image/*": [] }} value={form.watch("image")} setValue={(file) => form.setValue("image", file, { shouldTouch: true, }) } + maxSizeInBytes={5 * 1024 * 1024} // Example: 5MB limit + onError={(error) => { + form.setError("image", { + type: "manual", + message: error.message + }); + }} className="rounded-lg border-border bg-background transition-all duration-200 hover:border-active-border hover:bg-background" />
176-191: 🛠️ Refactor suggestionAdd URL validation for social URLs.
The social URL field should validate that the input is a properly formatted URL.
<FormField control={form.control} name={`socialUrls.${index}.url`} render={({ field }) => ( <FormItem className="flex-1"> <FormControl> <Input {...field} placeholder="https://..." aria-label="Platform URL" + type="url" /> </FormControl> <FormMessage /> </FormItem> )} />Also ensure your form schema (in form.ts) includes URL validation for these fields.
🧹 Nitpick comments (2)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx (1)
3-6: Remove unused empty imports.There are several empty imports that should be removed as they add unnecessary code.
-import {} from "@/components/blocks/multi-step-status/multi-step-status"; -import {} from "@/components/ui/dialog"; import { zodResolver } from "@hookform/resolvers/zod"; -import {} from "lucide-react"; import { useState } from "react";apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/token-info-fieldset.tsx (1)
6-6: Remove unused empty import.The card component is imported but not used. Remove this empty import.
-import {} from "@/components/ui/card";
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (36)
apps/dashboard/src/@/actions/revalidate.ts(1 hunks)apps/dashboard/src/@/components/blocks/distribution-chart.tsx(1 hunks)apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.stories.tsx(1 hunks)apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/index.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/primary-dashboard-button.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/components/supply-layout.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/DeployedContractsPageHeader.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/DeployViaCLIOrImportCard.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/DeployedContractsPage.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/getProjectContracts.ts(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/getSortedDeployedContracts.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/cards.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-card.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page-impl.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.stories.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-airdrop.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-distribution.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-sale.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/form.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/launch/launch-token.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/token-info-fieldset.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/tracking.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/components/ProjectSidebarLayout.tsx(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/connect/account-abstraction/factories/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/hooks/project-contracts.ts(1 hunks)apps/dashboard/src/components/buttons/MismatchButton.tsx(2 hunks)apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx(1 hunks)apps/dashboard/src/components/contract-components/import-contract/modal.tsx(7 hunks)apps/dashboard/src/components/contract-components/tables/contract-table.stories.tsx(6 hunks)apps/dashboard/src/components/contract-components/tables/contract-table.tsx(6 hunks)apps/dashboard/src/contract-ui/components/solidity-inputs/address-input.tsx(3 hunks)apps/dashboard/src/global.css(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.tsx
🚧 Files skipped from review as they are similar to previous changes (33)
- apps/dashboard/src/app/(app)/account/contracts/_components/DeployedContractsPage.tsx
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/primary-dashboard-button.tsx
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/components/supply-layout.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/DeployViaCLIOrImportCard.tsx
- apps/dashboard/src/global.css
- apps/dashboard/src/components/contract-components/tables/contract-table.stories.tsx
- apps/dashboard/src/app/(app)/account/contracts/DeployedContractsPageHeader.tsx
- apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/connect/account-abstraction/factories/page.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/getSortedDeployedContracts.tsx
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/index.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/components/ProjectSidebarLayout.tsx
- apps/dashboard/src/@/actions/revalidate.ts
- apps/dashboard/src/app/(app)/account/contracts/_components/getProjectContracts.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/hooks/project-contracts.ts
- apps/dashboard/src/contract-ui/components/solidity-inputs/address-input.tsx
- apps/dashboard/src/components/buttons/MismatchButton.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/page.tsx
- apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.stories.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/page.tsx
- apps/dashboard/src/@/components/blocks/distribution-chart.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-card.tsx
- apps/dashboard/src/components/contract-components/tables/contract-table.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/tracking.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.stories.tsx
- apps/dashboard/src/components/contract-components/import-contract/modal.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/cards.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-distribution.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-sale.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/launch/launch-token.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/form.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-airdrop.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page-impl.tsx
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: Lint Packages
- GitHub Check: Size
- GitHub Check: Analyze (javascript)
joaquim-verges
approved these changes
May 22, 2025
Merge activity
|
<!--
## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"
If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):
## Notes for the reviewer
Anything important to call out? Be sure to also clarify these in your comments.
## How to test
Unit tests, playground, etc.
-->
<!-- start pr-codex -->
---
## PR-Codex overview
This PR introduces several enhancements and features related to asset management, including deployment tracking, UI updates, and new forms for creating and managing tokens. It also refines existing components and adds new functionalities for improved user experience.
### Detailed summary
- Added `deploymentType` and `contractType` properties in various components.
- Introduced `revalidatePathAction` for path revalidation.
- Updated UI components for better asset management.
- Enhanced forms for token creation with validation.
- Implemented multi-step status tracking for token launch processes.
- Improved error handling and user feedback in forms.
- Added new charts for token distribution visualization.
> The following files were skipped due to too many changes: `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/launch/launch-token.tsx`, `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-airdrop.tsx`
> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`
<!-- end pr-codex -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Introduced a comprehensive asset management interface for creating, importing, and managing ERC-20 tokens within team and project dashboards.
- Added a multi-step token creation flow with form validation, including token info, distribution, sale settings, airdrop CSV upload, and launch process with real-time status tracking.
- Implemented visual token allocation charts and multi-step progress indicators for enhanced user experience.
- Added a dedicated "Assets" section in the sidebar with a "New" badge.
- Added a horizontal segmented distribution bar chart component for visualizing token allocations.
- Introduced a multi-step status component to track asynchronous step executions with retry capabilities.
- Added token airdrop CSV upload and validation feature with user-friendly UI and error handling.
- Added token sale configuration section with price and allocation inputs.
- Enhanced import modal to support both contract and asset imports with contextual UI and behavior.
- Added new pages and components to support token asset creation and management workflows, including cards for asset actions.
- Added server-side path revalidation support for pages and layouts.
- **Improvements**
- Enhanced contract and asset import workflows with clearer UI, context-aware dialogs, and improved contract table variant handling.
- Updated number input fields to remove browser-native spinners for a cleaner appearance.
- Improved analytics event tracking for user interactions and deployment steps.
- Refined UI components for consistent styling and accessibility.
- Fixed sidebar badge placement and updated UI text for clarity.
- Updated dialogs and payment embeds to reference transaction chain instead of active wallet chain and set default payment amounts.
- Changed token supply label to "Circulating Supply" for clarity.
- Replaced Chakra UI spinner and styled elements with local components for simplified UI.
- **Bug Fixes**
- Corrected UI typos and improved analytics event tracking for deployment errors.
- **Documentation**
- Added Storybook stories for new components to facilitate UI testing and documentation.
- **Chores**
- Refactored and extended types and props to support new asset and contract features, ensuring future extensibility.
- Added tracking utilities for token deployment and asset creation analytics.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
graphite-app
bot
force-pushed
the
05-20-_tool-4531_dashboard_add_token_asset_creation_wizard
branch
from
24a556b to
73629e9
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (3)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx (3)
83-85: Add form validation before proceeding to next stepCurrently, the code transitions to the next step without validating that the current form is valid. This could lead to incomplete or invalid data being used later in the flow.
onNext={() => { + // Validate form before proceeding + tokenInfoForm.trigger().then((isValid) => { + if (isValid) { setStep("distribution"); + } + }); }}
97-99: Add form validation before proceeding to launch stepSimilar to the previous step transition, there's no validation before moving to the launch step.
onNext={() => { + // Validate form before proceeding + tokenDistributionForm.trigger().then((isValid) => { + if (isValid) { setStep("launch"); + } + }); }}
111-114: Validate combined form data before passing to LaunchTokenStatusWhen combining form data for the launch step, no validation is performed to ensure the complete dataset is valid.
{step === "launch" && ( <LaunchTokenStatus client={props.client} onLaunchSuccess={props.onLaunchSuccess} onPrevious={() => { setStep("distribution"); }} createTokenFunctions={props.createTokenFunctions} + // Ensure both forms are valid before proceeding + isValid={tokenInfoForm.formState.isValid && tokenDistributionForm.formState.isValid} + form={{ + tokenInfoForm, + tokenDistributionForm, + }} values={{ ...tokenInfoForm.getValues(), ...tokenDistributionForm.getValues(), }} /> )}Then in LaunchTokenStatus component, add validation before beginning the launch sequence.
🧹 Nitpick comments (2)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx (2)
3-6: Remove unused empty importsThere are several empty imports that don't bring any symbols into scope:
-import {} from "@/components/blocks/multi-step-status/multi-step-status"; -import {} from "@/components/ui/dialog"; -import {} from "lucide-react"; +// Remove unused importsThese should either be removed entirely or replaced with actual imports if the components are needed elsewhere in the file.
40-60: Consider adding field labels and more descriptive initial valuesThe initial form values are mostly empty strings, which doesn't provide guidance to users about expected formats. Consider adding either:
- More descriptive placeholder values that show format examples
- Default values that make sense for common use cases
- Tooltip descriptions for each field
This would improve the user experience by making it clearer what information should be entered in each field.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (36)
apps/dashboard/src/@/actions/revalidate.ts(1 hunks)apps/dashboard/src/@/components/blocks/distribution-chart.tsx(1 hunks)apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.stories.tsx(1 hunks)apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/index.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/primary-dashboard-button.tsx(1 hunks)apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/components/supply-layout.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/DeployedContractsPageHeader.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/DeployViaCLIOrImportCard.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/DeployedContractsPage.tsx(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/getProjectContracts.ts(1 hunks)apps/dashboard/src/app/(app)/account/contracts/_components/getSortedDeployedContracts.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/cards.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-card.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page-impl.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.stories.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-airdrop.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-distribution.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-sale.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/form.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/launch/launch-token.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/token-info-fieldset.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/tracking.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/components/ProjectSidebarLayout.tsx(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/connect/account-abstraction/factories/page.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/hooks/project-contracts.ts(1 hunks)apps/dashboard/src/components/buttons/MismatchButton.tsx(2 hunks)apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx(1 hunks)apps/dashboard/src/components/contract-components/import-contract/modal.tsx(7 hunks)apps/dashboard/src/components/contract-components/tables/contract-table.stories.tsx(6 hunks)apps/dashboard/src/components/contract-components/tables/contract-table.tsx(6 hunks)apps/dashboard/src/contract-ui/components/solidity-inputs/address-input.tsx(3 hunks)apps/dashboard/src/global.css(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (35)
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/components/supply-layout.tsx
- apps/dashboard/src/app/(app)/account/contracts/DeployedContractsPageHeader.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/DeployViaCLIOrImportCard.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/connect/account-abstraction/factories/page.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/DeployedContractsPage.tsx
- apps/dashboard/src/global.css
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/primary-dashboard-button.tsx
- apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/index.tsx
- apps/dashboard/src/@/actions/revalidate.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/components/ProjectSidebarLayout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/hooks/project-contracts.ts
- apps/dashboard/src/components/contract-components/tables/contract-table.stories.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/getSortedDeployedContracts.tsx
- apps/dashboard/src/app/(app)/account/contracts/_components/getProjectContracts.ts
- apps/dashboard/src/components/buttons/MismatchButton.tsx
- apps/dashboard/src/contract-ui/components/solidity-inputs/address-input.tsx
- apps/dashboard/src/@/components/blocks/distribution-chart.tsx
- apps/dashboard/src/components/contract-components/tables/contract-table.tsx
- apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx
- apps/dashboard/src/components/contract-components/import-contract/modal.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.stories.tsx
- apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.stories.tsx
- apps/dashboard/src/@/components/blocks/multi-step-status/multi-step-status.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-card.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-sale.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-airdrop.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/page.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/distribution/token-distribution.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/cards.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/tracking.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/page.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/launch/launch-token.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page-impl.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/form.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/token-info-fieldset.tsx
⏰ Context from checks skipped due to timeout of 90000ms (4)
- GitHub Check: Unit Tests
- GitHub Check: Size
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
Comment on lines
+62
to
+75
| const tokenDistributionForm = useForm<TokenDistributionFormValues>({ | ||
| resolver: zodResolver(tokenDistributionFormSchema), | ||
| values: { | ||
| // sale fieldset | ||
| saleAllocationPercentage: "0", | ||
| salePrice: "0.1", | ||
| supply: "1000000", | ||
| saleEnabled: false, | ||
| // airdrop | ||
| airdropEnabled: false, | ||
| airdropAddresses: [], | ||
| }, | ||
| reValidateMode: "onChange", | ||
| }); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add input validation for numerical values
The form includes numerical values like saleAllocationPercentage, salePrice, and supply that are currently stored as strings. While Zod validation likely handles this, consider adding:
- Proper type conversion in the form
- Min/max constraints for percentage values (0-100)
- Minimum values for price and supply to prevent invalid or negative values
This would provide better guidance to users and prevent errors during token creation.
🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx
between lines 62 and 75, the form fields for numerical values like
saleAllocationPercentage, salePrice, and supply are currently initialized as
strings without explicit input validation or type conversion. Update the form to
convert these fields to appropriate numeric types on input, enforce min/max
constraints such as 0 to 100 for saleAllocationPercentage, and set minimum
allowed values for salePrice and supply to prevent negative or invalid inputs.
This involves adjusting the form initialization values, adding validation rules
or schema refinements, and ensuring the UI input components reflect these
constraints for better user guidance and data integrity.
Comment on lines
+77
to
+118
| return ( | ||
| <div> | ||
| {step === "token-info" && ( | ||
| <TokenInfoFieldset | ||
| client={props.client} | ||
| form={tokenInfoForm} | ||
| onNext={() => { | ||
| setStep("distribution"); | ||
| }} | ||
| /> | ||
| )} | ||
|
|
||
| {step === "distribution" && ( | ||
| <TokenDistributionFieldset | ||
| form={tokenDistributionForm} | ||
| accountAddress={props.accountAddress} | ||
| chainId={tokenInfoForm.watch("chain")} | ||
| onPrevious={() => { | ||
| setStep("token-info"); | ||
| }} | ||
| onNext={() => { | ||
| setStep("launch"); | ||
| }} | ||
| /> | ||
| )} | ||
|
|
||
| {step === "launch" && ( | ||
| <LaunchTokenStatus | ||
| client={props.client} | ||
| onLaunchSuccess={props.onLaunchSuccess} | ||
| onPrevious={() => { | ||
| setStep("distribution"); | ||
| }} | ||
| createTokenFunctions={props.createTokenFunctions} | ||
| values={{ | ||
| ...tokenInfoForm.getValues(), | ||
| ...tokenDistributionForm.getValues(), | ||
| }} | ||
| /> | ||
| )} | ||
| </div> | ||
| ); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add loading states during form transitions
The component doesn't manage loading states during step transitions or form submissions. Consider adding:
export function CreateTokenAssetPageUI(props: {
accountAddress: string;
client: ThirdwebClient;
createTokenFunctions: CreateTokenFunctions;
onLaunchSuccess: () => void;
}) {
const [step, setStep] = useState<"token-info" | "distribution" | "launch">(
"token-info",
);
+ const [isLoading, setIsLoading] = useState(false);
// ... rest of code
return (
<div>
{step === "token-info" && (
<TokenInfoFieldset
client={props.client}
form={tokenInfoForm}
+ isLoading={isLoading}
onNext={() => {
+ setIsLoading(true);
// Validate form before proceeding
tokenInfoForm.trigger().then((isValid) => {
if (isValid) {
setStep("distribution");
}
+ setIsLoading(false);
});
}}
/>
)}
// ... apply similar changes to other stepsThis would provide visual feedback to users during transitions and prevent multiple submissions.
Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/assets/create/create-token-page.client.tsx
between lines 77 and 118, the component lacks loading state management during
step transitions and form submissions. Add a loading state variable to track
when a transition or submission is in progress, update this state appropriately
in the onNext and onPrevious handlers, and conditionally render a loading
indicator or disable buttons to provide visual feedback and prevent multiple
submissions.
This was referenced May 23, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
PR-Codex overview
This PR focuses on enhancing the asset creation workflow in the application, particularly for deploying and managing ERC-20 tokens. It introduces new tracking functionalities, UI components, and state management improvements.
Detailed summary
deploymentTypeandcontractTypeproperties in various components.revalidatePathActionfor cache revalidation.Summary by CodeRabbit
New Features
Improvements
Bug Fixes
Documentation
Chores